<!-- components/MainContent.vue -->
<template>
    <a-layout-content class="content">
        <a-card class="todolistCard">
            <TodoList />
        </a-card>
    </a-layout-content>
</template>

<script setup>
import TodoList from "@/components/TodoList.vue";
</script>

<style scoped>
.content {
    display: flex;
    flex-direction: column;
    //justify-content: center;
    align-items: center;
    overflow-y: scroll;
    background-color: #ffffff;
    width: 100%;
    height: 100%;
}
.todolistCard {
    position: sticky;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 80%;
    height: 100%;
    background-color: #c8f3f6;
}
</style>
